<template>
  <div class="home">
    <el-container class="containeer">
      <el-header style="#638181">
        <strong>欧西森商城后台管理</strong>
      </el-header>
      <!--<div class="headertop">-->

      <!--</div>-->
      <el-container>
        <el-aside width="202px" :style="{ height: allheight + 'px',background:'#215454'}">
          <el-menu  theme="dark" :router="true" :unique-opened="true"  background-color="#215454" text-color="#9ebfbf" active-text-color="#ffd04b">
            <el-submenu index="1">
              <template slot="title" ><i class="iconfont icon-shouyexinxi font_HouuTai"></i>首页</template>
              <el-menu-item index="1-1" :route="{path: '/homepage'}">首页</el-menu-item>
              <el-menu-item index="1-3" :route="{path: '/achievement'}">省级业绩统计</el-menu-item>
            </el-submenu>
            <el-submenu index="2">
              <template slot="title"><i class="iconfont icon-yonghuguanli font_HouuTai"></i>用户管理</template>
              <el-menu-item-group>
                <template slot="title">分组一</template>
                <el-menu-item index="2-1" :route="{path: '/salesman'}">业务员</el-menu-item>
                <el-menu-item index="2-2" :route="{path: '/agent'}">代理</el-menu-item>
                <el-menu-item index="2-3" :route="{path: '/user'}">用户</el-menu-item>
              </el-menu-item-group>
            </el-submenu>
            <el-submenu index="3">
              <template slot="title"><i class="iconfont icon-shangcheng font_HouuTai"></i>商城管理</template>
              <el-menu-item-group>
                <template slot="title">分组一</template>
                <el-menu-item index="3-1" :route="{path: '/mygoods'}">我的商品</el-menu-item>
                <el-menu-item index="3-2" :route="{path: '/addgoods'}">添加商品</el-menu-item>
              </el-menu-item-group>
              <el-menu-item-group title="分组2">
                <el-menu-item index="3-3" :route="{path: '/classification'}">我的分类</el-menu-item>
              </el-menu-item-group>
            </el-submenu>
            <el-submenu index="4">
              <template slot="title"><i class="iconfont icon-dingdanguanli font_HouuTai"></i>订单管理</template>
              <el-menu-item index="4-1" :route="{path: '/untreatedorder'}">未处理订单</el-menu-item>
              <el-menu-item index="4-2" :route="{path: '/alreadyorder'}">已处理订单</el-menu-item>
            </el-submenu>
            <el-submenu index="5">
              <template slot="title"><i class="iconfont icon-tixian font_HouuTai"></i>提现管理</template>
              <el-menu-item index="5-1" :route="{path: '/untreatedtixian'}">未处理提现</el-menu-item>
              <el-menu-item index="5-2"  :route="{path: '/alreadytixian'}">已处理提现</el-menu-item>
            </el-submenu>
            <el-submenu index="6">
              <template slot="title" ><i class="iconfont icon-iconfontjiduxiaoshoufandian font_HouuTai"></i>返点管理</template>
              <el-menu-item index="6-1" :route="{path: '/rebatewater'}">返点流水记录</el-menu-item>
            </el-submenu>
            <el-submenu index="7">
              <template slot="title"><i class="iconfont icon-guanggaowei font_HouuTai"></i>广告位管理</template>
              <el-menu-item index="7-1" :route="{path: '/advertisement'}">轮播图管理</el-menu-item>
            </el-submenu>

          </el-menu>
        </el-aside>
        <el-main style="line-height:0px; padding:10px;background-color: #fcfcfc;text-align: initial;">
          <router-view></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>
<script>
  import {
    mapGetters
  } from 'vuex'
  export default {
    components: {},
    data(){
      return {
        allheight: '',
      }
    },
    methods: {
      handleOpen(key, keyPath) {
        console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        console.log(key, keyPath);
      }
    },
    watch: {},
    computed: {
      ...mapGetters([
        'GetToken',
      ]),
    },
    mounted(){

    },
    created(){
      document.body.style.background = '#fcfcfc';
        if(this.GetToken == ''){
          this.$router.push({
            path: './'
          })
        }

      this.allheight = window.screen.availHeight - 120;
//      GetToken
    }
  }
</script>
<style scoped>
  .home {
    width: 100%;
    height: 100%;
  }
.font_HouuTai{
  margin-right: 10px;
}
  .class_pading {
    padding: 10px;
    float: left;
  }

  .left_ {
    height: 100%;
    width: 200px;
    overflow-y: scroll;
  }

  .right_ {
    width: 100%;
    height: 100%;
    background: #fcfcfc;
    padding: 30px;
  }

  .containeer {
    width: 100%;
    height: 100%;

  }
.headertop{
  /*height: 60px;*/
  /*background-color: #B3C0D1;*/
  /*color: #333;*/
  /*text-align: center;*/
  /*line-height: 60px;*/
  /*background-color: #638181;*/
}
  .el-header, .el-footer {
    background-color: #638181;
    color: white;
    text-align: center;
    line-height: 60px;
  }

  .el-aside {
    background-color: #D3DCE6;
    color: #333;
    text-align: center;
    line-height: 200px;
  }

  .el-main {
    background-color: #E9EEF3;
    color: #333;
    text-align: center;
    line-height: 160px;
  }

  body > .el-container {
    margin-bottom: 40px;
  }

  .el-container:nth-child(5) .el-aside,
  .el-container:nth-child(6) .el-aside {
    line-height: 260px;
  }

  .el-container:nth-child(7) .el-aside {
    line-height: 320px;
  }
</style>
